<template>
<!-- :default-active的作用是说明：当前激活菜单的index -->
    <el-menu
    class="el-menu-admin"
    :default-active="currentPath"
    router
    mode="vertical"
    background-color="#fff"
    active-text-color="#ffd04b"
    :collapse="isCollapse"
    >
    <div style="height:80px;"></div>
        <!-- index 没有用但是必须字段 -->
        <el-submenu v-for="(item,i) in adminMenus" :key="i" :index="(i).toString()" style="text-align；left">
            <span slot="title" style="font-size:17px;">
                <i :class="item.iconCls"></i>
                    {{item.nameZh}}
            </span>
            <el-menu-item v-for="child in item.children" :key="child.path" :index="child.path">
                <i :class="child.icon"></i>
                {{child.nameZh}}
            </el-menu-item>
        </el-submenu>
    </el-menu>
</template>
<script>
export default {
    name:'AdminMenu',
    data(){
        return{
            isCollapse:false
        }
    },
    computed:{
        adminMenus(){
            return this.$store.state.adminMenus
        },
        currentPath(){
            //通过this.$route访问路由器
            return this.$route.path
        }
    }
    
}
</script>
<style scoped>

</style>